import React from 'react';
import { Layout, Menu } from 'antd';
import { Route, Link } from "react-router-dom"

import Employee from './employee';
import Setting from './setting';

import './App.less';

const { Header, Footer, Content } = Layout;

const App = ({match}: any) => {
  let defaultKey = match.url.replace('/', '') || 'employee';
  return (
    <Layout>
      <Header>
      <Menu
        theme="dark"
        mode="horizontal"
        defaultSelectedKeys={[defaultKey]}
        className="menu"
      >
        <Menu.Item key="employee"><Link to="/employee">员工管理</Link></Menu.Item>
        <Menu.Item key="setting"><Link to="/setting">系统设置</Link></Menu.Item>
      </Menu>
      </Header>
      <Content className="contentWrap">
        <div className="content">
          <Route path="/" exact component={Employee} />
          <Route path="/employee" component={Employee} />
          <Route path="/setting" component={Setting} />
        </div>
      </Content>
      <Footer className="footer">
        creat by @zongwu77@126.com
      </Footer>
    </Layout>
  )
}

export default App;